<template>
    <div class="bind-container">
        <div class="bind-icon">
            <img src="@/assets/Images/AppIcon/icon_company.png" />
        </div>
        <div class="bind-company">{{companyName}}</div>
        <div class="bind-btns">
            <eagle-button type="primary" @click="onBindCompany">绑定该公司</eagle-button>
            <eagle-button type="default" @click="onBack">取消</eagle-button>
        </div>
    </div>
</template>

<script>
import { Dialog } from 'vant'

export default {
    data() {
        return {
            codeType: this.$route.query.codeType,
            data: this.$route.query.data,
            companyCode: "",
            companyName: "苏州文科",
        };
    },
    created() {
        this.getCompany();
    },
    methods: {
        getCompany() {
            this.$axios.post("/Public/QRCodeGetCompany", {
                CodeType: this.codeType,
                Data: this.data
            }).then((res) => {
                if (res.success) {
                    this.companyCode = res.data.CompanyCode;
                    this.companyName = res.data.CompanyName
                }
            })
        },
        onBack() {
            this.$router.goRefresh();
        },
        onBindCompany() {
            Dialog.confirm({
                title: '询问',
                message: '确定要绑定该公司吗?',
            })
                .then(() => {
                    this.$axios.get("/UserUser/BindCompany", {
                        params: {
                            companyCode: this.companyCode
                        }
                    }).then((res) => {
                        if (res.success) {
                            this.$toast("绑定成功");
                            setTimeout(() => {
                                this.$store.commit("updateCompanyCode", this.companyCode);
                                this.$router.goRefresh()
                            }, 1000);
                        }
                    })
                })
                .catch(() => {
                    // on cancel
                })
        }
    },
};
</script>

<style lang="less" scoped>
.bind-icon {
    margin-top: 30px;
    text-align: center;
    img {
        margin: 0 auto;
    }
}

.bind-company {
    text-align: center;
    font-size: 16px;
    margin-top: 20px;
}

.bind-btns {
    margin-top: 30px;
}

.bind-container {
    padding-left: 30px;
    padding-right: 30px;
    .van-button {
        width: 100%;
        margin-bottom: 10px;
    }
}
</style>
